/**
 * Created by liguangsong on 16/8/2.
 */
import React, { Component, PropTypes } from 'react'
import { Link, hashHistory } from 'react-router'
import { connect } from 'react-redux'
import { touchMove, touchCancel } from '../../action/index.js'
import getTeamColorWithName from '../../assist/teamColor.js'

var PlayerInfoView = React.createClass( {

        render() {
            //console.log(this.props.playerTeam);
            const { dispatch, nameColor, teamColor } = this.props;
            return (
                //<Link to={linkStr}  >
                    <div onClick={this.handleClick} onTouchStart={this.handleTouchMove} onTouchEnd={this.handleTouchCancel} className="playerInfoView" >
                        <p className="playersName" style={{color: nameColor}}>{this.props.playerName}</p>
                        <p className="playersTeam" style={{color: teamColor}}>{this.props.playerTeam}</p>
                        <div className="line"></div>
                        <img className="goToPlayerImg" src="app/assist/edit_right.png" />
                    </div>
                //</Link>

            )
        },

        handleClick(event) {
            event.preventDefault();
            var backColor = getTeamColorWithName(this.props.playerTeam);
            var linkStr = "/Player/" + this.props.playerId + '/' + backColor + '/' + this.props.playerName;
            hashHistory.push(linkStr)
        }

        //handleTouchCancel(event) {
        //    //console.log('---------');
        //    this.props.dispatch(touchCancel());
        //},
        //
        //handleTouchMove(event) {
        //    this.props.dispatch(touchMove());
        //}


    }
);

function select(state) {
    return {
        nameColor: state.touchPlayer.nameColor,
        teamColor: state.touchPlayer.teamColor
    }
}

export default connect(select)(PlayerInfoView)